<template>
	<view class="" :style="[AppSkinVar]">
		<view class="e-p-20 bg-white e-m-b-20">
			<view class="bg-gradient-primary e-flex c-white e-radius-20 text-center" style="height: 216rpx;">
				<view class="e-flex-2 e-rela people">
					<view class="e-font-48 fw-600 e-m-b-6">{{info.storeAll||0}}</view>
					<view class="e-font-26">商家数量</view>
				</view>
				<view class="e-flex-2 e-rela">
					<view class="e-font-48 fw-600 e-m-b-6">{{info.rewardAll||0}}</view>
					<view class="e-font-26">奖励金额</view>
				</view>
			</view>
		</view>
		<view class="e-p-l-20 e-p-r-20">
			<view class="e-p-l-20 e-p-r-20 e-p-t-30 e-p-b-30 e-flex e-flex-between e-m-b-20 bg-white e-radius-20" @tap="$goTo('/pages/user/agent/info',{id:item.id})" v-for="item in list" :key="item.id">
				<text class="e-font-30 fw-500">{{item.agentLevelName}}</text>
				<view class="e-flex">
					<text class="e-font-30 c-secondary e-p-r-10">{{item.agentAddress}}</text>
					<e-icon name="arrow-right" color="#999" size="36rpx"></e-icon>
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script setup>
	import {ref,computed} from 'vue'
	import {getAgentRewardCount} from '@/common/request/api'
	import {
		onShow
	} from '@dcloudio/uni-app'
	
	const info = ref({})
	
	const list = computed(() => info.value?.agent||[])
	
	onShow(() => {
		getAgentRewardCount().then(res => {
			info.value = res.data
		})
	})
</script>

<style lang="scss" scoped>
	.people {
		&::after {
			content: '';
			position: absolute;
			width: 2rpx;
			height: 72rpx;
			right: 0;
			top: calc(50% - 36rpx);
			background: #ffffff;
			opacity: 0.2;
		}
	}
</style>